<template>
    <view class="cn-page-home">
        <nSwiper>
            <template #items>
                <swiper-item>
                    <image src="/static/image/page-home/banner-top-1.png" mode="aspectFill"></image>
                </swiper-item>
            </template>
        </nSwiper>
        <nGrid :row="grid.row" :col="grid.col" :border="false" :list="grid.list"></nGrid>
        <swiper class="bg-white margin-tb-20" style="height: 100rpx;" :circular="true" :autoplay="true" :vertical="true">
            <template v-if="article_list.length > 0">
                <swiper-item v-for="(info, key) in article_list" :key="key" class="flex align-center margin-lr-50" @tap="$store.commit('userNavTo', '/article/info?article_id='+info.article_id)">
                    <view>
                        <text class="cuIcon-newfill text-orange"></text>
                        <text class="margin-left-20">{{info.title}}</text>
                    </view>
                </swiper-item>
            </template>
            <swiper-item v-else class="flex align-center margin-lr-50">
                <view>
                    <text class="cuIcon-newfill text-orange"></text>
                    <text class="margin-left-20">暂无公告</text>
                </view>
            </swiper-item>
        </swiper>
        <nBar title="兑换原始股权"></nBar>
        <view class="flex flex-direction align-center bg-white">
            <image @tap="$store.commit('userNavTo', '/project/invest/page?type=0&area_code=0&type_area_no=0')" class="cn-invest-image"
                src="/static/image/page-home/invest-zylx.png"></image>
            <image @tap="$store.commit('userNavTo', '/project/invest/list?type=100')" class="cn-invest-image" src="/static/image/page-home/invest-yyzx.png"></image>
            <image @tap="$store.commit('userNavTo', '/project/invest/page?type=3&area_code=0&type_area_no=0')" class="cn-invest-image"
                src="/static/image/page-home/invest-zyqc.png"></image>
            <image class="cn-invest-image" src="/static/image/page-home/invest-zyjy.png"></image>
        </view>
        <modalDialog :show.sync="upgrade_dialog.show" title="更新应用" :is_hide_cancel="true" :not_cancel="true"
            :is_scroll_content="true" :confirm="upgradeConfirm" confirm_title="去更新">
            <template #content>
                <view class="margin-bottom-30">
                    <view v-for="(info, key) in upgrade_dialog.list" :key="key" class="margin-bottom-14">
                        <text class="text-15 text-bold text-333">
                            {{info.version_no}}：
                        </text>
                        <text class="text-666">
                            {{info.upgrade_remark}}
                        </text>
                    </view>
                </view>
            </template>
        </modalDialog>
    </view>
</template>

<script>
    import nSwiper from '@/components/nddyny/base/nSwiper.vue';
    export default {
        components: {
            nSwiper
        },
        data() {
            let col;
            let grid_list = [{
                name: '金股兑换',
                icon: 'sponsorfill',
                color: 'nddyny',
                uri: '/user/goldShare/exchange'
            }, {
                name: '推广礼包',
                icon: 'presentfill',
                color: 'pink',
                uri: '/user/promote/gift/list'
            }, {
                name: '中营慈善',
                icon: 'likefill',
                color: 'red',
                uri: '/project/charity/page'
            }];
            if (this.$store.state.user.is_seller_firm == 1) {
                col = 4;
            } else {
                col = 5;
                grid_list = grid_list.concat([{
                    name: '商家入驻',
                    icon: 'shopfill',
                    color: 'blue',
                    uri: '/seller/user/apply'
                }]);
            }
            grid_list = grid_list.concat([{
                name: '股东大会',
                icon: 'newfill',
                color: 'orange',
                uri: '/article/list'
            }]);
            return {
                article_list: [],
                grid: {
                    row: 1,
                    col: col,
                    list: grid_list
                },
                upgrade_dialog: {
                    show: false,
                    list: [],
                }
            }
        },
        mounted() {
            if (this.$app.upgrade_list.length > 0) {
                this.upgrade_dialog.show = true;
                this.upgrade_dialog.list = this.$app.upgrade_list;
            } else {
                this.$api.post(this, {
                    url: '/alone/index',
                    success: (Result) => {
                        if (this.$api.form.toast(this, Result)) return;
                        this.article_list = Result.result.article_list || [];
                    }
                });
            }
        },
        methods: {
            upgradeConfirm() {
                this.$store.commit('userNavTo', '/page/upgrade');
            }
        }
    }
</script>

<style lang="less">
    .cn-page-home {
        .cn-invest-image {
            width: 690rpx;
            height: 170rpx;
            margin-bottom: 16rpx;
        }
    }
</style>
